<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 对象的继承

        // 要求：实现一个Person的对象，内有name和age属性，一个eat方法：
        //       在实现一个Stu学生对象，去继承Person对象，内心班级属性，和学习方法

        //1. ES5标准的写法：
        // 声明一个人Person1构造函数
        function Person1(name, age){
            this.name = name;
            this.age = age;
        }
        // 为当前构造函数的原型添加一个方法
        Person1.prototype.eat = function(){
            console.log(this.name, "爱吃黄焖鸡");
        }

        // 声明一个学生 Stu1 构造函数
        function Stu1(name, age, classid){
            Person1.call(this, name, age);
            this.classid = classid;
        }
        // 使用原型链完成 Stu1 对 Person1的继承
        Stu1.prototype = new Person1();
        Stu1.prototype.constructor = Stu1;
        // 在学生原型对象上添加方法
        Stu1.prototype.study = function(){
            console.log(this.name, this.classid, "好好学习中....");
        }

        // 使用实例化
        const s = new Stu1("王翠花", 16, "Web1013班");
        console.log(s);
        s.eat();
        s.study();
    
        //2. 使用ES6标准写法：
        // 声明一个Person2类
        class Person2{
            // 构造函数
            constructor(name, age){
                this.name = name;
                this.age = age;
            }
            // 普通方法
            eat(){
                console.log(this.name, "爱吃黄焖鸡"); 
            }
        }
        // 声明一个Stu子类，去继承上面 Person 父类
        class Stu2 extends Person2{
            // 构造方法
            constructor(name, age, classid){
                // 通过super()调用父类的构造函数，完成name和age的初始化
                super(name,age);
                this.classid = classid;
            }
            // 编写普通方法
            study(){
                console.log(this.name, this.classid, "好好学习中....");
            }
            
        }

        //测试，实例化Stu2
        const s2 = new Stu2("王建国",20,"web1013");
        s2.eat();
        s2.study();
        console.log(s2);
    </script>
</body>
</html>